<template>
	<view class="container">
		<uni-section title="PPT生成" type="line">
			<view class="example">
				<uni-forms ref="baseForm">
					<uni-forms-item label="课程选择"> 
						      <uni-data-select
						        :localdata="range"
						        @change="change"
						      ></uni-data-select>
					</uni-forms-item>
					<uni-forms-item label="章节选择">
						      <uni-data-select
						        :localdata="course"
						        @change="change2"
						      ></uni-data-select>
					</uni-forms-item>
					<uni-forms-item label="作者">
						<uni-easyinput v-model="author" placeholder="请输入作者名字" @input="yourName" />
					</uni-forms-item>
					<uni-forms-item label="备注">
						<uni-easyinput type="textarea"  placeholder="是否需要备注" />
					</uni-forms-item>
				</uni-forms>
				<button type="primary" size="mini">取消</button>
				<button type=" primary" size="mini" @click="getPPT">确定</button>
			</view>
		</uni-section>
	</view>
</template>

<script setup>
	import {
		ref,
		reactive
	} from 'vue';
	import apis from '../../api/apis';
	
	const range = ref([
		{
			text:'',
			value:0
		},
	])
	const course = ref([
		{
			text:'无选项',
			courseId:0,
			value:0
		}
	])
	// const courseId = ref(0)
	const courseID = ref(0)
	const courseResourseID = ref(0)
	const author = ref('')
	const theme = ref('nightSkyMirror')
	
	const change =async (e)=>{
		// console.log(e)
		courseID.value = e
		console.log(courseID.value)
		let res = await apis.getChapterName(e)
		course.value = res.data.map(item=>({
			text:item.title,
			courseId:item.courseId,
			value:item.courseResourceId
		}))
	}
	const change2 = (e)=>{
		// console.log(e)
		courseResourseID.value = e
		console.log(courseResourseID.value)
	}
	const getCourse = async()=>{
		let res = await apis.getCourseName()
		console.log(res.data)
		range.value = res.data.map(item => ({
		  text: item.name,
		  value: item.value
		}));
	}
	

	const formRef = ref(null);

	getCourse()
	
	const yourName = (e) => {
		author.value = e
	}
	
	const getPPT = async()=>{
		const course = ref({
			courseId:courseID.value,
			courseResourceId:courseResourseID.value,
			author:author.value,
			theme:theme.value
		})
		// console.log(course.value)
		let res = await apis.createPPTByCourse(course.value)
		plus.runtime.openURL(res.data)
		
	}
		



	const submit = (ref) => {
		formRef.value.validate().then(() => {
			uni.showToast({
				title: '生成成功'
			});
		}).catch((err) => {
			console.log('err', err);
		});
	};
	
</script>

<style lang="scss">
	.example {
		padding: 15px;
		background-color: #fff;
	}

	button {
		margin-left: 150rpx;
		margin-right: 50rpx;
	}

	image {
		height: 300rpx;
		width: 100%;
	}
</style>